<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
 
<style>
body{
	padding:0;
	margin:0;
}
#Flickerbox{
	width:100%;
	height:100%;
	position:fixed;
	top:0;left:0;right:0;bottom:0;
	box-shadow: inset 0px 0px 8px red;
	transition:box-shadow 1s;
}
 
.Flickerclass1{
	box-shadow: inset 0px 0px 8px red !important;
}
.Flickerclass2{
	box-shadow: inset 0px 0px 100px red !important;
}
</style>
</head>
<body>
 
<div id="Flickerbox" class="Flickerclass1">
<script>
$(function(){
	setInterval(function(){
	if($("#Flickerbox").attr("Flicker") == "1"){
		$("#Flickerbox").removeClass("Flickerclass1").addClass("Flickerclass2");
		$("#Flickerbox").attr("Flicker","2");
	}else{
		$("#Flickerbox").removeClass("Flickerclass2").addClass("Flickerclass1");
		$("#Flickerbox").attr("Flicker","1");
	}
		
	},1000);
});
</script>
</div>
</body>
</html>

